class UIBase{
  constructor (props){
    //形参是props，实参可以是任何类型的数据,eg {name:"kaka"} this.props={name:"kaka"} => this.props.name="kaka"
    this.props=props;
    //我们改为在创建对象的时候，就生成一个this.element，直接可以直接加入到document.body(或者网页中的任意位置)
    this.render();
  }

//render的作用就是将得到的html元素赋值给this.element，同时再次调用的使用，替换掉上一次调用时生成的element元素
  render(){
    //这个起到的是定位的作用，因为第一次渲染返回的是一个html元素，第二次渲染的时候需要加在上次渲染的位置后面，并且删除上一个渲染的元素
    let oldElement=this.element;
    var div=document.createElement("div");
    //这里不能使用innerText，因为我们要将整个标签内部的内容重写
    div.innerHTML=this._render(this.props);
    //这个是我们要渲染的部分，返回一个可以在网页上显示的html标签
      this.element=div.querySelector(":first-child");
      if(oldElement){
        //需要替换掉换来旧的元素，所以使用方法insertAdjacent
        oldElement.insertAdjacentElement("afterEnd",this.element);
        oldElement.remove();
      }

  }
}
